var $_x = 0;
var $_y = 0;

$(function(){
	$('img.infopts').css({'cursor':'crosshair'}).click(function(e){
		$('#infox').val(parseInt(e.pageX - $(this).position().left));
		$('#infoy').val(parseInt(e.pageY - $(this).position().top));
		$('#infoh').val($(this).height());
		$('#infow').val($(this).width());
		$('#addPoint').submit();
	});

	$('#ptsareaOL').css({'cursor':'move'}).mousedown(function(e){
		$_x = e.pageX;
		$_y = e.pageY;

		$(this).mousemove(function(e){
			var $x = e.pageX;
			var $y = e.pageY;

			

			var x = $_x - $x;
			var y = $_y - $y;

			var nx = parseInt($('#infox').val()) + x;
			var ny = parseInt($('#infoy').val()) + y;

			$('#infox').val(nx);
			$('#infoy').val(ny);
			$('#ptsarea').css({'background-position' : (-nx+200) + 'px ' + (-ny+100) + 'px'});


			$_x = $x;
			$_y = $y;
		})
	}).mouseout(function(){$(this).unbind('mousemove')}).mouseup(function(){$(this).unbind('mousemove')});
});




